<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <title> Insha - Css3 Responsive Sidebar Menu</title>

    <link href="static/css/css2.css" rel="stylesheet">
    <link href='static/css/boxicons.min.css' rel='stylesheet'>
    <link rel="stylesheet" href="static/css/insha-style.css">

</head>

<body>

<div class="main" id="app">
    <div class="sidebar">
        <div class="logo_content">
            <div class="logo">
                <div class="logo_name">
                    <a href="#">
                        <i class='bx bxs-bank'></i>
                        银行业务管理系统
                    </a>
                </div>
            </div>
            <i class='bx bx-menu' id="toggle-menu-btn"></i>
        </div>
        <ul class="nav_list">

            <li>
                <a href="online.html">
                    <i class='bx bx-yen'></i>
                    <span class="links_name">网上银行</span>
                </a>
                <span class="tooltip">网上银行</span>
            </li>
            <li>
                <a href="counter.html">
                    <i class='bx bxs-user-account'></i>
                    <span class="links_name">银行柜面</span>
                </a>
                <span class="tooltip">银行柜面</span>
            </li>

        </ul>

    </div>
    <div class="home_content">
        <div class="text">银行柜面</div>
        我是转账页面
        <div class="rg_layout1">
            <div class="rg_left">
                <p>用户转账</p>
                <p>TRANSFER ACCOUNTS</p>

            </div>
            <div class="rg_center">
                <div class="rg_form">
                    <!--定义表单 form-->
                    <form action="#" method="">
                        <table id="tbe0">
                            <tr>
                                <td class="td_left"><label for="name">收款人姓名</label></td>
                                <td class="td_right"><input type="text" name="name" id="name" placeholder="请输入姓名"
                                                            v-model="name"></td>
                            </tr>
                            <tr>
                                <td class="td_left"><label for="idCard">收款人卡号</label></td>
                                <td class="td_right"><input type="text" name="idCard" id="idCard"
                                                            placeholder="请输入银行卡号" v-model="idCard" @blur="ic1()">
                                </td>
                            </tr>
                            <tr>
                                <td class="td_left"><label for="accounts">转账金额为</label></td>
                                <td class="td_right"><input type="text" name="accounts" id="accounts"
                                                            v-model="accounts" @blur="am()"
                                                            placeholder="金额首位数字不为0"></td>
                            </tr>
                            <tr>
                                <td class="td_left"><label for="idCard1">付款人卡号</label></td>
                                <td class="td_right"><input type="text" name="idCard1" id="idCard1"
                                                            placeholder="请输入银行卡号" v-model="idCard1" readonly>
                                </td>
                            </tr>
                            <tr>
                                <td class="td_left"><label for="password">支付密码</label></td>
                                <td class="td_right"><input type="password" name="password" id="password"
                                                            placeholder="请输入银行卡密码6位" v-model="password"
                                                            @blur="pd1()"></td>
                            </tr>

                            <tr>
                                <td class="td_left"><label for="remark">备注</label></td>
                                <td class="td_right"><input type="text" name="remark" id="remark"
                                                            placeholder="请输入备注" v-model="remark"></td>
                            </tr>


                            <tr>
                                <td colspan="2" align="center"><input type="button" id="btn_sub" value="确认转账"
                                                                      @click="cm()"></td>
                            </tr>

                        </table>

                    </form>


                </div>

            </div>

            <button id="bn1" @click="back1()">返回</button>
        </div>
    </div>

</div>


<script src="static/js/scripts.js"></script>
<script src="static/js/vue.js"></script>
<script src="static/js/axios.min.js"></script>
<script>
    // window.onload = function () {


    //     var searchUrl = window.location.href;
    //     var searchData = searchUrl.split("="); //截取 url中的“=”,获得“=”后面的参数
    //     var searchText = decodeURI(searchData[1]); //decodeURI解码
    //     app.idCard1 = searchText


    // }
    const app = new Vue({
        el: "#app",
        data: {
            name: "",
            idCard: "",
            password: "",
            accounts: null,
            idCard1: localStorage.getItem("bankNo"),
            remark: ""

        },
        methods: {
            back1() {
                location.href = "onlineindex.html"
            },
            am() {

                if (this.accounts.indexOf("0") == 0) {
                    alert("您的金额输入不正确")
                    this.accounts = null
                }
            },
            cm() {


                if (this.idCard != "" && this.password != "") {
                    let uuid;
                    //存息

                    axios.get("http://localhost:8080/interestSettlementController/countInterestSettlement?data=0&bankNo=" + this.idCard1).then(res => {
                        if (res.data.code == 200) {
                            //转账请求
                            axios.post("http://localhost:8080/tranfer/transferMoney", {
                                //参数未知
                                payeeName: this.name,
                                payeeCardNo: this.idCard,
                                payerPassword: this.password,
                                money: this.accounts,
                                payerCardNo: this.idCard1,
                                remark: this.remark
                            }).then(res => {
                                if (res.data.code == null) {
                                    alert("系统异常")
                                } else {
                                    alert(res.data.message)
                                    window.location.reload();
                                }

                            })

                        } else {
                            alert("系统故障，转账失败")
                        }
                    })

                } else {
                    alert("以上信息不能为空")
                }


            },
            // ic() {
            //     if ((this.idCard.length != 16 && this.idCard.length != 17 && this.idCard.length != 19) && this.idCard != "") {
            //         let rule = new RegExp("(^([1-9]{1})(\d{16}|\d{17}\d{19})$)")
            //         if (rule.test(this.idCard) == false) {
            //             alert("您的银行卡格式不正确，请重新输入")
            //         }

            //     }
            // },
            ic1() {
                if ((this.idCard1.length != 16 && this.idCard1.length != 17 && this.idCard1.length != 19) && this.idCard1 != "") {
                    let rule = new RegExp("(^([1-9]{1})(\d{16}|\d{17}\d{19})$)")
                    if (rule.test(this.idCard1) == false) {
                        alert("您的银行卡格式不正确，请重新输入")
                    }

                }
            },

            pd1() {
                if (this.password1 != "") {
                    let rule = new RegExp("(^[0-9]*$)")
                    if (rule.test(this.password1) == false) {
                        if (this.password1.length != 6) {
                            alert("您的密码格式不正确，请重新输入")
                            this.password1 = "";
                        }
                    }

                }

            }

        }
    })
</script>

</body>

</html>
